import React from 'react';
import {
    Button,
    AutoComplete,
    Input,
    message,
    DatePicker,
    Select
} from 'antd';
import axios from 'axios';
import intercept from '../../../utils/intercept';
import { config } from 'utils';
import "../common.less";
const Option = AutoComplete.Option;
const { TextArea } = Input;
export default class passwordResert extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            dataSource: [],
            loading: false,
            stations: [],
            daysells: [],
            opTerminals: [],
            keyword: '',

        };
    };
    componentDidMount() {
        this.getStationInfo('410101');
    };
    search = (value) => {
        this.stationCode = value;
    }
    searchDistribution = (value) => {
        this.distributor = value;
    }
    send = () => {
        const token = sessionStorage.getItem("token");
        let messageContent = document.getElementById("myTextInput").value;
        axios.post(`${config.api}CustomService/SendMessage`,
            { reason: messageContent, station: this.stationCode, traderAccount: this.distributor, startTime: this.sendDate, isTest: true, testPhone: '' },
            { headers: { Authorization: 'Bearer ' + token } })
            .then((data) => {
                console.log(data)
                if (data.data.result) {
                    message.success('发送成功！');
                } else {
                    message.warning(data.data.errorMessage);
                }
            })
            .catch(err => {
                intercept
            })
    }
    dateOnChange = (d, date) => {
        this.sendDate = date;
    }
    getStationInfo = (globalcode) => {
        const token = sessionStorage.getItem("token");
        axios
            .get(`${config.api}DailyStatics/GetStationInfo?globalcode=${globalcode}`, {
                headers: {
                    Authorization: 'Bearer ' + token
                }
            })
            .then((res) => {
                if (res.data.result) {
                    let tmp = res
                        .data
                        .stationsInfo
                        .map(m => (
                            <Option key={m.key} value={m.label}>
                                <span>{m.label}</span>
                            </Option>
                        ));
                    this.setState({
                        stations: tmp,
                    })
                } else {
                    this.openNotification('获取车站信息失败', res.data.errorMessage, 'red');
                    this.setState({ stations: res.data.stations })
                }
            })
            .catch(err => {
                intercept
            })
    }


    render() {
        let distribution = ['atm', 'ctrip', 'fliggy', 'hn96520', 'TongCheng', 'wechat', 'Alipay', 'chebada', 'wechathn96520', '微信小程序']
            .map(item => (
                <Option key={item} value={item}>
                    <span>{item}</span>
                </Option>
            ))
        return (
            <div style={{ marginLeft: 50 }}>
                <div style={{
                    margin: 10
                }}>
                    <span>时&nbsp;间：</span>
                    <DatePicker style={{ marginLeft: 20 }} onChange={this.dateOnChange} />
                </div>
                <div style={{
                    margin: 10
                }}>
                    <span>车&nbsp;站：</span>
                    <AutoComplete
                        style={{
                            width: 400,
                            marginLeft: 20
                        }}
                        onSelect={this.search}
                        dataSource={this.state.stations}
                        optionLabelProp="value"
                        placeholder="请选择车站"
                        filterOption={(inputValue, option) => option.props.children.props.children.toUpperCase().indexOf(inputValue.toUpperCase()) !== -1}
                    />
                </div>
                <div style={{
                    margin: 10
                }}>
                    <span>分销商：</span>
                    <Select
                        mode="multiple"
                        style={{ width: 400, marginLeft: 12 }}
                        placeholder="请选择分销商"
                        onChange={this.searchDistribution}
                    >
                        {distribution}
                    </Select>
                </div>

                <div style={{
                    margin: 10
                }}>
                    <span className="message">信息内容: </span>
                    <TextArea
                        placeholder="信息内容"
                        id="myTextInput"
                        style={{ height: 70, width: 400, marginLeft: 12, marginTop: 10 }}
                    />
                </div>
                <Button type="primary" onClick={this.send} style={{ marginTop: 20, marginLeft: 200 }}>发送</Button>

            </div>
        )
    }
}
